let id = 0
let ul = document.getElementsByClassName('ul')[0]
function loop() {
  if (id) {
    clearTimeout(id)
  }
  let li = ul.firstElementChild
  li.style.transition = 'margin-top 1s linear'
  li.style.marginTop = '-30px'
  id = setTimeout(function () {
    ul.appendChild(li)
    li.style.transition = 'unset'
    li.style.marginTop = '0'
    loop()
  }, 1000)
}
loop()

ul.onmouseenter = function () {
  if (id) {
    clearTimeout(id)
  }
}
ul.onmouseleave = function () {
  loop()
}
